<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>首页</title>
  <link rel="stylesheet" href="/styles/common.css">
  <link rel="stylesheet" href="/styles/index.css">
</head>
<body>
<header class="header">
  <div class="column">
    <img class="logo" src="http://our8pafcg.bkt.clouddn.com/zhike/images/logo.png" alt="智客">
  </div>
  <div class="column column-right">
    <a href="#" class="active-tab">首页</a>
    <a href="#">开始研究</a>
    <a href="#" >个人中心</a>
    <a href="#">帮助</a>
    <button class="btn btn-primary btn-radius">登录</button>
    <a href="#">注册</a>
  </div>
</header>
<div class="banner">
  <div class="bg-layer">
    <p class="msg">AI智客，大数据和机器智能时代的量化投资</p>
    <p class="desc">为量化投资者提供华尔街专业机构的设备</p>
    <button class="btn btn-radius">了解更多</button>
  </div>

</div>
<div class="benefit">
  <div>
    <i class="iconfont icon-security"></i>
    <div class="benefit-desc-wrapper">
      <p class="benefit-name">安全靠谱</p>
      <span class="benefit-desc">保障策略100%安全</span>
    </div>
  </div>
  <div>
    <i class="iconfont icon-precise"></i>
    <div class="benefit-desc-wrapper">
      <p class="benefit-name">精准分析</p>
      <span class="benefit-desc">高质量的精准数据</span>
    </div>
  </div>
  <div>
    <i class="iconfont icon-topspeed"></i>
    <div class="benefit-desc-wrapper">
      <p class="benefit-name">极速回测</p>
      <span class="benefit-desc">精准且极速的回测</span>
    </div>
  </div>
  <div>
    <i class="iconfont icon-invite"></i>
    <div class="benefit-desc-wrapper">
      <p class="benefit-name">邀请奖励</p>
      <span class="benefit-desc">一笔投资多笔获利</span>
    </div>
  </div>
</div>
<div class="tactics-wrapper">
  <h4>推荐策略</h4>
  <div class="recommond-wrapper">
    <div class="recommond-item">
      <span class="tactics-index">TOP1</span>
      <p>银行日内</p>
      <p class="profit-num">680.11%</p>
      <p class="all-profit-text">总收益</p>
      <span class="tactics-type">外汇期货</span>
      <div id="chart1" class="chart-wrapper"></div>
      <button class="btn btn-primary btn-block btn-radius">立即订阅</button>
      <div class="tactics-extra clearfix">
        <div class="pull-left">发布者:张三</div>
        <div class="scribe-info">订阅数:123&nbsp;&nbsp;订阅费:123元/月</div>
      </div>
    </div>
    <div class="recommond-item">
      <span class="tactics-index">TOP1</span>
      <p>银行日内</p>
      <p class="profit-num">680.11%</p>
      <p class="all-profit-text">总收益</p>
      <span class="tactics-type">外汇期货</span>
      <div id="chart2" class="chart-wrapper"></div>
      <button class="btn btn-primary btn-block btn-radius">立即订阅</button>
      <div class="tactics-extra clearfix">
        <div class="pull-left">发布者:张三</div>
        <div class="scribe-info">订阅数:123&nbsp;&nbsp;订阅费:123元/月</div>
      </div>
    </div>
    <div class="recommond-item">
      <span class="tactics-index">TOP1</span>
      <p>银行日内</p>
      <p class="profit-num">680.11%</p>
      <p class="all-profit-text">总收益</p>
      <span class="tactics-type">外汇期货</span>
      <div id="chart3" class="chart-wrapper"></div>
      <button class="btn btn-primary btn-block btn-radius">立即订阅</button>
      <div class="tactics-extra clearfix">
        <div class="pull-left">发布者:张三</div>
        <div class="scribe-info">订阅数:123&nbsp;&nbsp;订阅费:123元/月</div>
      </div>
    </div>
  </div>
  <h4>热门策略</h4>
  <div class="hot-tactics-wrapper">
    <div class="hot-left-wrapper">
      <i class="iconfont icon-licai"></i>
      <div class="hot-left-top">
        <p>安全靠谱</p>
        <p>&emsp;&emsp;极速回测</p>
      </div>
    </div>
    <div class="hot-right-wrapper">
      <div class="hot-tactics-item">
        银行日内
        <div class="hot-tactics-row1 clearfix">
          策略类别：外汇期货
          <div class="pull-right">
            总收益：<span class="all-profit">688.8%</span>
          </div>
        </div>
        <div class="hot-tactics-row2">
          <div>订阅数：123&emsp;订阅费：123元/月</div>
          <div>
            <button class="btn btn-scribe">立即订阅</button>
          </div>
        </div>
      </div>
      <div class="hot-tactics-item">
        银行日内
        <div class="hot-tactics-row1 clearfix">
          策略类别：外汇期货
          <div class="pull-right">
            总收益：<span class="all-profit">688.8%</span>
          </div>
        </div>
        <div class="hot-tactics-row2">
          <div>订阅数：123&emsp;订阅费：123元/月</div>
          <div>
            <button class="btn btn-scribe">立即订阅</button>
          </div>
        </div>
      </div>
      <div class="hot-tactics-item">
        银行日内
        <div class="hot-tactics-row1 clearfix">
          策略类别：外汇期货
          <div class="pull-right">
            总收益：<span class="all-profit">688.8%</span>
          </div>
        </div>
        <div class="hot-tactics-row2">
          <div>订阅数：123&emsp;订阅费：123元/月</div>
          <div>
            <button class="btn btn-scribe">立即订阅</button>
          </div>
        </div>
      </div>
      <div class="hot-tactics-item">
        银行日内
        <div class="hot-tactics-row1 clearfix">
          策略类别：外汇期货
          <div class="pull-right">
            总收益：<span class="all-profit">688.8%</span>
          </div>
        </div>
        <div class="hot-tactics-row2">
          <div>订阅数：123&emsp;订阅费：123元/月</div>
          <div>
            <button class="btn btn-scribe">立即订阅</button>
          </div>
        </div>
      </div>
    </div>
  </div>
  <h4>全部策略</h4>
  <table class="all-tatics-table"><tbody>
  <tr>
    <td colspan="6"><span class="tactics-index">TOP1</span>银行日内</td>
  </tr>
  <tr>
    <td>总收益</td>
    <td>发布者</td>
    <td>策略类型</td>
    <td>订阅数</td>
    <td>订阅费</td>
    <td rowspan="2" class="btn-column">
      <button class="btn btn-scribe">修改策略</button>
    </td>
  </tr>
  <tr>
    <td><span class="all-profit">680.11%</span></td>
    <td>杀毒</td>
    <td>外汇期货</td>
    <td>123</td>
    <td>123元/月</td>
  </tr>
  <tr>
    <td colspan="6" class="row-divider"><span class="tactics-index">TOP1</span>银行日内</td>
  </tr>
  <tr>
    <td>总收益</td>
    <td>发布者</td>
    <td>策略类型</td>
    <td>订阅数</td>
    <td>订阅费</td>
    <td rowspan="2" class="btn-column">
      <button class="btn btn-scribe">修改策略</button>
    </td>
  </tr>
  <tr>
    <td><span class="all-profit">680.11%</span></td>
    <td>杀毒</td>
    <td>外汇期货</td>
    <td>123</td>
    <td>123元/月</td>
  </tr>
  <tr>
    <td colspan="6" class="row-divider"><span class="tactics-index">TOP1</span>银行日内</td>
  </tr>
  <tr>
    <td>总收益</td>
    <td>发布者</td>
    <td>策略类型</td>
    <td>订阅数</td>
    <td>订阅费</td>
    <td rowspan="2" class="btn-column">
      <button class="btn btn-scribe">修改策略</button>
    </td>
  </tr>
  <tr>
    <td><span class="all-profit">680.11%</span></td>
    <td>杀毒</td>
    <td>外汇期货</td>
    <td>123</td>
    <td>123元/月</td>
  </tr>
  <tr>
    <td colspan="6" class="row-divider"><span class="tactics-index">TOP1</span>银行日内</td>
  </tr>
  <tr>
    <td>总收益</td>
    <td>发布者</td>
    <td>策略类型</td>
    <td>订阅数</td>
    <td>订阅费</td>
    <td rowspan="2" class="btn-column">
      <button class="btn btn-scribe">修改策略</button>
    </td>
  </tr>
  <tr>
    <td><span class="all-profit">680.11%</span></td>
    <td>杀毒</td>
    <td>外汇期货</td>
    <td>123</td>
    <td>123元/月</td>
  </tr>
  <tr>
    <td colspan="6" class="row-divider"><span class="tactics-index">TOP1</span>银行日内</td>
  </tr>
  <tr>
    <td>总收益</td>
    <td>发布者</td>
    <td>策略类型</td>
    <td>订阅数</td>
    <td>订阅费</td>
    <td rowspan="2" class="btn-column">
      <button class="btn btn-scribe">修改策略</button>
    </td>
  </tr>
  <tr>
    <td><span class="all-profit">680.11%</span></td>
    <td>杀毒</td>
    <td>外汇期货</td>
    <td>123</td>
    <td>123元/月</td>
  </tr>
  <tr>
    <td colspan="6" class="row-divider"><span class="tactics-index">TOP1</span>银行日内</td>
  </tr>
  <tr>
    <td>总收益</td>
    <td>发布者</td>
    <td>策略类型</td>
    <td>订阅数</td>
    <td>订阅费</td>
    <td rowspan="2" class="btn-column">
      <button class="btn btn-scribe">修改策略</button>
    </td>
  </tr>
  <tr>
    <td><span class="all-profit">680.11%</span></td>
    <td>杀毒</td>
    <td>外汇期货</td>
    <td>123</td>
    <td>123元/月</td>
  </tr>
  <tr>
    <td colspan="6" class="row-divider"><span class="tactics-index">TOP1</span>银行日内</td>
  </tr>
  <tr>
    <td>总收益</td>
    <td>发布者</td>
    <td>策略类型</td>
    <td>订阅数</td>
    <td>订阅费</td>
    <td rowspan="2" class="btn-column">
      <button class="btn btn-scribe">修改策略</button>
    </td>
  </tr>
  <tr>
    <td><span class="all-profit">680.11%</span></td>
    <td>杀毒</td>
    <td>外汇期货</td>
    <td>123</td>
    <td>123元/月</td>
  </tr>
  <tr>
    <td colspan="6" class="row-divider"><span class="tactics-index">TOP1</span>银行日内</td>
  </tr>
  <tr>
    <td>总收益</td>
    <td>发布者</td>
    <td>策略类型</td>
    <td>订阅数</td>
    <td>订阅费</td>
    <td rowspan="2" class="btn-column">
      <button class="btn btn-scribe">修改策略</button>
    </td>
  </tr>
  <tr>
    <td><span class="all-profit">680.11%</span></td>
    <td>杀毒</td>
    <td>外汇期货</td>
    <td>123</td>
    <td>123元/月</td>
  </tr>
  <tr>
    <td colspan="6" class="row-divider"><span class="tactics-index">TOP1</span>银行日内</td>
  </tr>
  <tr>
    <td>总收益</td>
    <td>发布者</td>
    <td>策略类型</td>
    <td>订阅数</td>
    <td>订阅费</td>
    <td rowspan="2" class="btn-column">
      <button class="btn btn-scribe">修改策略</button>
    </td>
  </tr>
  <tr>
    <td><span class="all-profit">680.11%</span></td>
    <td>杀毒</td>
    <td>外汇期货</td>
    <td>123</td>
    <td>123元/月</td>
  </tr>
  <tr>
    <td colspan="6" class="row-divider"><span class="tactics-index">TOP1</span>银行日内</td>
  </tr>
  <tr>
    <td>总收益</td>
    <td>发布者</td>
    <td>策略类型</td>
    <td>订阅数</td>
    <td>订阅费</td>
    <td rowspan="2" class="btn-column">
      <button class="btn btn-scribe">修改策略</button>
    </td>
  </tr>
  <tr>
    <td><span class="all-profit">680.11%</span></td>
    <td>杀毒</td>
    <td>外汇期货</td>
    <td>123</td>
    <td>123元/月</td>
  </tr>
  </tbody></table>
</div>
<footer class="footer">
  <div class="inner-wrap">
    <div>
      <p class="col-title"><i class="iconfont icon-link"></i>&nbsp;相关链接</p>
      <div class="content">
        <a href="http://www.datayes.com/" target="_blank">通联数据</a>&nbsp;&nbsp;让投资更容易
        <br/>
        <a href="http://m.datayes.com/" target="_blank">数据商城</a>&nbsp;&nbsp;海量金融大数据
        <br/>
        <a href="https://mof.datayes.com/" target="_blank">通联魔方</a>&nbsp;&nbsp;MOM/FOF全流程管理平台
        <br/>
        <a href="https://robo.tt/home/" target="_blank">萝卜投研</a>&nbsp;&nbsp;智能投研平台
        <br/>
        <a href="http://www.jinlingxuetang.com" target="_blank">金领学堂</a>&nbsp;&nbsp;学习更便捷
      </div>
    </div>
    <div>
      <p class="col-title"><i class="iconfont icon-location"></i>&nbsp;联系地址</p>
      <div class="content">
        总部地址： 北京市朝阳区望京街道保利国际广场T2-303
        <br/>成都分部： 四川省成都市天府大道中段希顿广场C座701
      </div>
    </div>
    <div>
      <p class="col-title"><i class="iconfont icon-telephone"></i>&nbsp;联系方式</p>
      <div class="content">
        电话: 400-696-8026
      </div>
    </div>
    <div class="qrcode-wrapper">
      <img class="qrcodeimg" src="https://uqer.io/home/img/code.jpg" alt="二维码"><br>
      <span>扫描二维码关注公众号</span>
    </div>
  </div>
  <br>
  <p class="copyright">
    <span>© 2017 <a href="http://www.datayes.com/" target="_blank">DataYes</a></span>
    <a class="icp" href="http://www.miibeian.gov.cn/" target="_blank">沪ICP备13045831号</a>
    <span>咨询热线：4000 820 386</span>
    <span>智客 Beta</span>
    <a href="http://www.datayes.com/protocol" target="_blank">用户协议</a>
  </p>
</footer>

<script src="http://our8pafcg.bkt.clouddn.com/zhike//js/echarts.min.js"></script>
<script>
  // 使用 DOM节点 初始化echarts实例
  var chart1 = echarts.init(document.getElementById('chart1'));
  var chart2 = echarts.init(document.getElementById('chart2'));
  var chart3 = echarts.init(document.getElementById('chart3'));

  var baseOption = {
    title: {
      show: false // 隐藏标题
    },
    grid: {
      show: false,
      left: 0,
      top: 0,
      right: 0,
      bottom: 1
    },
    xAxis: {
      show: true, // 隐藏 X 轴
      type: 'category', // 类目轴
      boundaryGap: false, // 两边不留白
      data: []
    },
    yAxis: {
      show: true, // 隐藏 Y 轴
      type: 'value',
      axisLine: {
        show: false // 不显示轴线
      }
    },
    series: [{
      type: 'line', // 折线图
      smooth: true, // 平滑曲线(弧线)
      symbol: 'none', // 没有标记图形
      sampling: 'average', // 优化图表的绘制效率,取过滤点的平均值
      areaStyle: { // 区域填充样式
        normal: {
          color: 'rgba(73, 152, 244, 0.1)'
        }
      },
      data: [],
      color: ['#328bf4']
    }]
  }; // 基础配置
  // 基础配置
  chart1.setOption(baseOption);
  chart2.setOption(baseOption);
  chart3.setOption(baseOption);

  var date = ["2017/8/4", "2017/8/5", "2017/8/6", "2017/8/7", "2017/8/8"]; // X 轴坐标轴刻度数据
  var data = [0, 5, 3, 20, 10]; // 数据列表

  // 配置数据
  chart1.setOption({
    xAxis:{data: date},
    series: [{data: data}]
  });
  chart2.setOption({
    xAxis:{data: date},
    series: [{data: data}]
  });
  chart3.setOption({
    xAxis:{data: date},
    series: [{data: data}]
  });
</script>
</body>
</html>